import React, { Component } from 'react';

import CrawlerService from 'services/Crawler';

import ListTitle from 'components/common/ListTitle';
import TableHead from 'components/common/TableHead';
import TableBody from './TableBody';

import { CRAWLER_TH } from 'config/table_config';
import crawlerData from 'config/crawler_config';

import './index.scss';

const crawlerService = new CrawlerService();

export default class Crawler extends Component {
  constructor(props) {
    super(props);

    this.state = {
      title: '数据爬虫管理',
      crawlerData
    }
  }

  onCrawlClick (apiName, index) {
    // const { crawlerData } = this.state,
    //       loading = crawlerData[index].loading;
    // crawlerData[index].loading = !loading;

    crawlerData[index].loading = !this.state.crawlerData[index].loading;

    this.setState({
      crawlerData
    }, async () => {
      const result = await crawlerService.crawlAction(apiName),
            errorCode = result.error_code;

      crawlerData[index].loading = !this.state.crawlerData[index].loading;
    
      this.setState({
        crawlerData
      })

      if (errorCode === 0) {//这里errorCode在后端返回的时0就表示成功了
        alert('数据爬取成功');
        return;
      }

      alert('数据爬取失败');
    })

  }

  render () {

    const { title, crawlerData } = this.state;

    return (
      <div className="list-container">
        <ListTitle 
          title={ title }
          refreshHide={ true }
        />

        <table className="list-table">
          <TableHead
            thData={ CRAWLER_TH }
          />

          <TableBody 
           crawlerData={ crawlerData }
           onCrawlClick={ this.onCrawlClick.bind(this) }
          />
        </table>
      </div>
    );
  }
}